Hop til hovedindhold

Opbygning

EnergyConnect er bygget efter en række designprincipper og konventioner, som skal sikre en ensartet og genkendelig brugeroplevelse på tværs af løsningen.

Det betyder, at brugeren vil møde de samme grundlæggende mønstre på tværs af sider og funktioner. Navigation, sideopbygning, handlinger og tabeller fungerer derfor efter samme principper, uanset hvilket område brugeren arbejder i.

Formålet er at gøre løsningen lettere at lære, hurtigere at arbejde i og mere forudsigelig i den daglige brug.

Skærmbillede 2026-01-19 kl. 10.43.35.png

Figur 1: Eksempel på målepunktssøgning

Overordnet layout

Løsningen er overordnet opdelt i to hovedområder:

  • Navigation i venstre side
  • Sideindhold i højre side

Denne opdeling går igen på tværs af løsningen og gør det muligt for brugeren hurtigt at orientere sig og skifte mellem områder.

I venstre side findes navigationen, som giver adgang til løsningens forskellige områder.

Navigationen viser de menupunkter, brugeren har adgang til, og gør det muligt hurtigt at skifte mellem eksempelvis dashboard, søgesider, målepunkter, tilslutningspunkter og øvrige hovedområder.

Læs mere om navigationen. image.png

Sideindhold

Højre side af løsningen er dedikeret til den aktuelle side og dens indhold. Det er her brugeren søger, ser detaljer, arbejder med tabeller, udfylder formularer og udfører handlinger.

Eksemplet nedenfor viser sideindholdet for en målepunktsvisning.

image.png

Sideindholdet varierer afhængigt af, hvilken visning brugeren befinder sig på, men opbygningen følger de samme grundlæggende principper. Det gør det lettere at genkende funktioner og arbejdsgange på tværs af løsningen.

De fleste sider har en header øverst. Headeren hjælper brugeren med at se, hvilken side eller enhed de befinder sig på, og giver adgang til relevante handlinger og navigationselementer.

image.png

Headeren kan eksempelvis indeholde:

  • sidens titel
  • relevant undertitel eller identifikation
  • faner til undersider
  • tilbage-navigation
  • handlingsmenu

Indholdet i headeren tilpasses den konkrete side. En detaljevisning vil eksempelvis ofte vise information om den valgte enhed, mens en søgeside i højere grad vil fokusere på søgning, resultater og handlinger på valgte rækker.

Handlinger

Handlinger er samlet i handlingsmenuen øverst til højre på siden. Menuen indeholder de handlinger, der er relevante for den side, brugeren befinder sig på.

image.png

Handlingsmenuen er kontekstafhængig. Det betyder, at indholdet kan ændre sig alt efter:

  • hvilken side brugeren befinder sig på
  • om der er valgt én eller flere rækker i en tabel
  • hvilken data handlingen vedrører
  • hvilke rettigheder brugeren har

Hvis en handling kræver, at brugeren først vælger et eller flere elementer, kan handlingen være utilgængelig, indtil kriterierne er opfyldt. På den måde viser menuen både, hvilke handlinger der findes, og hvornår de kan bruges.

På sider med tabeller kan handlinger også tilgås direkte fra tabellen. Hvis handlingerne knytter sig til en bestemt række, kan brugeren højreklikke på den ønskede række for at åbne de handlinger, der er relevante for netop dette element.

Det gør det muligt at arbejde hurtigere med tabeldata, fordi brugeren kan tilgå handlingerne dér, hvor data vises, uden først at skulle navigere til handlingsmenuen i headeren.